<template>
  <div>
      <h2>学生姓名：{{name}}</h2>
      <h2>学生年龄：{{age}}</h2>
      <button @click="sendStudentName">把学生名给School组件</button>
  </div>
</template>

<script>
export default {
    data(){
        return {
            name:'张三',
            age:19,
        }
    },
    methods: {
        sendStudentName(){
            // 按下按钮后使用全局事件总线触发getStName自定义事件然后传入数据到触发事件的回调中
            // this.$bus.$emit('getStName',this.name)
            this.$pubsub.publish('demo',this.name)
        }
    },
}
</script>

<style scoped>
    div{
        border: 3px solid rgb(71, 71, 71);
        box-shadow: 5px 5px 10px black;
        background-color: coral;
    }
    button{
        border: 3px solid rgb(71, 71, 71);
        background-color: seashell;
    }
    button:hover{
        cursor: pointer;
        background-color:lightsteelblue;
    }
</style>